// 基础颜色变量
:root {
  // 主题色
  --primary-color: #1890ff;
  --primary-color-hover: #40a9ff;
  --primary-color-active: #096dd9;
  --primary-color-outline: rgba(24, 144, 255, 0.2);
  
  // 文字颜色
  --text-color: rgba(0, 0, 0, 0.85);
  --text-color-secondary: rgba(0, 0, 0, 0.45);
  --text-color-disabled: rgba(0, 0, 0, 0.25);
  
  // 背景色
  --bg-color: #fff;
  --bg-color-secondary: #f5f5f5;
  --bg-color-tertiary: #f0f2f5;
  
  // 边框颜色
  --border-color: #d9d9d9;
  --border-color-split: #f0f0f0;
  
  // 尺寸
  --font-size-base: 14px;
  --border-radius-base: 4px;
  
  // 盒阴影
  --box-shadow-base: 0 2px 8px rgba(0, 0, 0, 0.15);
  
  // 动画
  --transition-duration: 0.2s;
}

// 暗黑模式变量
.dark-theme {
  // 文字颜色
  --text-color: rgba(255, 255, 255, 0.85);
  --text-color-secondary: rgba(255, 255, 255, 0.45);
  --text-color-disabled: rgba(255, 255, 255, 0.25);
  
  // 背景色
  --bg-color: #141414;
  --bg-color-secondary: #1f1f1f;
  --bg-color-tertiary: #262626;
  
  // 边框颜色
  --border-color: #434343;
  --border-color-split: #303030;
  
  // 盒阴影
  --box-shadow-base: 0 2px 8px rgba(0, 0, 0, 0.45);
}

// 紧凑模式
.compact-mode {
  --font-size-base: 12px;
  --border-radius-base: 2px;
}

// 应用CSS变量到全局元素
body {
  font-size: var(--font-size-base);
  color: var(--text-color);
  background-color: var(--bg-color-tertiary);
  transition: background-color var(--transition-duration), color var(--transition-duration);
}

// 卡片组件样式
.ant-card {
  background-color: var(--bg-color);
  border-radius: var(--border-radius-base);
  border-color: var(--border-color-split);
  transition: background-color var(--transition-duration), border-color var(--transition-duration);
  
  .ant-card-head {
    color: var(--text-color);
    border-bottom-color: var(--border-color-split);
  }
}

// 按钮组件样式
.ant-btn {
  border-radius: var(--border-radius-base);
  
  &-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    
    &:hover, &:focus {
      background-color: var(--primary-color-hover);
      border-color: var(--primary-color-hover);
    }
    
    &:active {
      background-color: var(--primary-color-active);
      border-color: var(--primary-color-active);
    }
  }
}

// 表单组件样式
.ant-input, .ant-select-selector, .ant-picker {
  border-radius: var(--border-radius-base);
}

// 表格组件样式
.ant-table {
  background-color: var(--bg-color);
  
  .ant-table-thead > tr > th {
    background-color: var(--bg-color-secondary);
    color: var(--text-color);
  }
} 